<template>
  <div>
    <div>
      <h3>1.使用router-link跳转路由</h3>
      <!--当前是/router01,跳转到router02-->
      <router-link to="/root02">router02</router-link>
    </div>
    <div>
      <h3>2.使用按钮跳转路由 (可以在回调函数中编写跳转之前要执行的代码)</h3>
      <!-- 按钮没法指定路由地址,但可以监听事件 -->
      <el-button type="primary" @click="goToroot02">router02</el-button>
    </div>
    <div>
      <h3>路由传参的方式1:直接拼接在路由地址后面</h3>
      <!-- 以?开头 -->
      <!-- 每一组参数都是k=v-->
      <!-- 多组之间用&拼接-->
      <router-link to="/root02?id=10&carName=奔驰S600">router02</router-link>
    </div>
      <div>
        <h3>路由传参的方式2：fangzia params对象中传</h3>
      </div>
  </div>
</template>

<script>
export default {
  name: "root01",
  methods:{
    goToroot02() {
      this.$confirm('是否确定要跳转到router02', '确认', {
        confirmButtonText:'跳转', // 指定确认按钮上的文字
        cancelButtonText:'取消' // 指定取消按钮上的文字
      }).then(()=>{
        // this.$router.push('/router?id=10&carName=宝马730')
        //Rest风格
        //在注册路由地址的时候用：作为展位师傅来指定参数的k
        //参数不适用？&拼接，也不需要在传参时指定K，直接用/指定V
        this.$router.push('/router02/10/兰博基尼')
      })
    }
  }
}
</script>

<style scoped>

</style>
